import type { FC } from 'react';
import Canvas from '../../components/SeatEditor';
import response from './response.json';
import styles from './styles.module.less';

let seats = response.data.show.venue.hall.areas[0].seats;

const regex = /\d+/g;

seats = seats.map(item => {
  const { columnAlias, rowAlias } = item;
  const rowNum = rowAlias.match(regex);
  const colNum = columnAlias.match(regex);
  return {
    ...item,
    seatNumber: {
      column: {
        type: 'letter',
        number: colNum?.[0]
      },
      row: {
        type: 'number',
        number: rowNum?.[0]
      }
    }
  }
})

const Test: FC = () => {
  return (
    <div className={styles.test}>
      <Canvas initSeats={seats} />
    </div>
  );
}


export default Test;
